<template>
  <div :class="{'app-mourn':conf.mourn===1}">
    <el-config-provider :size="size" :locale="zhCn">
      <router-view></router-view>
      <preview-image ref="pre"></preview-image>
    </el-config-provider>
  </div>
</template>
<script setup lang="ts">
import bus from "@/units/bus"
import {ref, onBeforeMount} from "vue"
//导入主题包
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
//导入登录维护hook
import {useMaintainLogin, useUserLogout} from "@/apps/admin/hooks/login"
import {useUiConfigure} from "@/apps/admin/hooks/layout"
import {useConfigure} from "@/apps/admin/hooks/configure"

/**
 * 挂载图片预览实例组件
 */
const pre = ref(null)

/**
 * 预览图片时间绑定到全局事件总线
 */
//@ts-ignore
bus.on('preview-img', (images: string | string[]) => pre?.value?.viewer(images))


//项目配置hook
const {getAppConfigure, conf} = useConfigure()
bus.on('reload-configure', getAppConfigure)//全局更新配置事件


/**
 * 监听退出登录事件
 */
bus.on('user-logout', () => {
  const {userLogout} = useUserLogout()
  userLogout()
})


/**
 * 刷新登录信息
 */
bus.on('refresh-login', useMaintainLogin)


//主题监控
const {size} = useUiConfigure(function (theme: string) {
  document.getElementsByTagName('html')[0].setAttribute('class', theme)
})


onBeforeMount(() => {
  //登录维护hook
  useMaintainLogin()

  //获取配置信息
  getAppConfigure()
})
</script>